<template>
    <Modal :title="modalTitle" v-model="modalVisible" :mask-closable='false' :width="600" :styles="{top: '30px'}">
        <Form ref="from" :model="fromModel" :label-width="70" :rules="formRules">
            <FormItem label="标题" prop="userName">
                <Input v-model="fromModel.userName" autocomplete="off"/>
            </FormItem>
        </Form>
        <div slot="footer">
            <Button type="text" @click="cancel">取消</Button>
            <Button type="primary" :loading="submitLoading" @click="submit">提交</Button>
        </div>
    </Modal>
</template>

<script>
    import {addUser, editUser} from "@/api/index";
    export default {
        name: "courseTypeModal",
        data() {
            return {
                accessToken: {},
                modalType: 0,
                modalTitle: "",
                submitLoading: false,
                modalVisible: false,
                fromModel: {
                    userName: "test"
                },
                formRules: {
                    userName: [
                        {required: true, message: "账号不能为空", trigger: "blur"}
                    ]
                }
            }
        },
        methods: {
            init() {
                this.accessToken = {
                    accessToken: this.getStore("accessToken")
                };

            },
            add() {
                this.setModalVisible('添加-', true);
            },
            edit() {
                this.setModalVisible('编辑-', true);
            },
            setModalVisible(title, visible) {
                this.modalTitle = title;
                this.modalVisible = visible;
            },
            cancel() {
                this.modalVisible = false;
            },
            submit() {
                this.$refs.from.validate(valid => {
                    if (valid) {
                        if (this.modalType === 0) {
                            // 添加用户 避免编辑后传入id
                            delete this.fromModel.id;
                            this.submitLoading = true;
                            addUser(this.fromModel).then(res => {
                                this.submitLoading = false;
                            if (res.status === true) {
                                this.$Message.success("添加成功");
                                this.$parent.refreshTable();
                                this.modalVisible = false;
                            }
                        });
                        } else {
                            // 编辑
                            editUser(this.fromModel).then(res => {
                                this.submitLoading = false;
                            if (res.status === true) {
                                this.$Message.success("修改成功");
                                this.$parent.refreshTable();
                                this.modalVisible = false;
                            }
                        });
                        }
                    }
                });
            }
        },
        mounted() {
            this.init();
        }
    }
</script>

<style>

</style>